<template>
  <div class="mc-markdown-card" :class="theme">
    {{ content }}
  </div>
</template>

<script setup lang="ts">
defineProps({
  content: {
    type: String,
    default: '',
  },
  theme: {
    type: String,
    default: 'light',
  },
});
</script>

<style scoped>
.mc-markdown-card {
  white-space: pre-wrap;
  word-break: break-word;
  line-height: 1.5;
}

.light {
  color: var(--devui-text, #252b3a);
}

.dark {
  color: var(--devui-light-text, #e9e9e9);
}
</style> 